<template>
  <base-breadcrumb :title="$route.meta.title">
    <!-- 质量岗位责任制 -->
    <div id="base-breadcrumb" style="position: relative; overflow: hidden">
      <div id="print-box" style="position: absolute; z-index: -1"></div>
      <!-- 搜索 -->
      <searchData :searchData="searchArr" @search="search"></searchData>
      <!-- 表格 -->
      <a-card :bordered="false">
        <!-- <title-name :title="$route.meta.title"></title-name> -->
        <div class="pub-table-select-count">
          <a-icon type="info-circle" theme="twoTone" />
          <span>
            应签人数：<span>{{ people.shouldSign }}</span>
            <span class="people"> | </span>
            实签人数：<span>{{ people.actualSign }}</span>
          </span>
        </div>
        <!-- 表格 -->
        <list-table ref="table" tableLayout="fixed" rowKey="projectId" size="default" :columns="columns" :request="loadData" :isShowCountBar="false">
          <template slot="actions" slot-scope="text, record">
            <MoreButton>
              <a
                v-btnPermission="[
                  {
                    ident: 'prma_seex',
                    code: 'seex_qm_049_loo_02'
                  },
                  {
                    ident: 'prma_buco',
                    code: 'buco_qm_049_loo_02'
                  }
                ]"
                @click="handleManage(0, record)"
                >查看</a
              >
              <a
                v-btnPermission="[
                  {
                    ident: 'prma_seex',
                    code: 'seex_qm_049_dis_01'
                  },
                  {
                    ident: 'prma_buco',
                    code: 'buco_qm_049_dis_01'
                  }
                ]"
                @click="handleManage(2,record)"
                >分发</a
              >
              <!-- 已签署的才能打印 -->
              <!-- <template v-if="record.statusCode === '2'">
                <BasePrintButton
                  buttonType="a"
                  v-btnPermission="[
                    {
                      ident: 'prma_seex',
                      code: 'seex_qm_049_pri_03'
                    },
                    {
                      ident: 'prma_buco',
                      code: 'buco_qm_049_pri_03'
                    }
                  ]"
                  :beforePrintFn="() => getPritContent(record.id)"
                />
              </template> -->
            </MoreButton>
          </template>
        </list-table>
      </a-card>
    </div>
  </base-breadcrumb>
</template>

<script>
import { duty, signStatic } from '@/api/quality/quality' // api
import BasePage from '@/views/basePage'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目名称
import OrgTreeSelect from '@/components/OrgTreeSelect'
import AuditSummary from '@/views/quality/components/AuditSummary' // 统计汇总
import BasePrintButton from '@/components/BasePrintButton' // 打印按钮
import SelectProjectStatus from '@/views/quality/components/SelectProjectStatus' // 项目状态

const searchArr = [
  // 搜索框
  {
    name: '所属单位',
    valueKey: 'searchQuery',
    type: OrgTreeSelect
  }
  // {
  //   name: '项目状态',
  //   type: SelectProjectStatus,
  //   valueKey: 'projectStatus'
  // },
  // {
  //   name: '责任书名称',
  //   type: 'input',
  //   value: 'bookName'
  // },
  // {
  //   name: '下发时间',
  //   type: 'dateRange',
  //   value: 'planningDate',
  //   attr: {
  //     rangeFormat: ['beginDate', 'endDate']
  //   }
  // }
]
const columns = [
  {
    title: '序号',
    width: 80,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    }
  },
  {
    title: '分公司',
    ellipsis: true,
    dataIndex: 'branchComName'
  },
  {
    title: '项目',
    ellipsis: true,
    dataIndex: 'projectName'
  },
  {
    title: '应签人数',
    ellipsis: true,
    dataIndex: 'shouldSign'
  },
  {
    title: '已签人数',
    ellipsis: true,
    dataIndex: 'actualSign'
  },

  // {
  //   title: '责任书名称',
  //   ellipsis: true,
  //   dataIndex: 'bookName'
  // },
  // {
  //   title: '岗位',
  //   ellipsis: true,
  //   dataIndex: 'postName'
  // },
  // {
  //   title: '员工名称',
  //   ellipsis: true,
  //   dataIndex: 'employeeName'
  // },
  // {
  //   title: '下发人',
  //   ellipsis: true,
  //   dataIndex: 'creatorName'
  // },
  // {
  //   title: '下发时间',
  //   dataIndex: 'createTime'
  // },
  // {
  //   title: '状态',
  //   dataIndex: 'statusName'
  // },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 150,
    // align: 'center',
    scopedSlots: { customRender: 'actions' }
  }
]
export default {
  name: 'a' + Date.now(),
  extends: new BasePage(),
  components: {
    AuditSummary,
    BasePrintButton
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      rate: ['', ''], // 导出进度
      queryParam: {}, // 查询参数
      removeApi: duty,
      people: {}, //
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        duty.signStatic(requestParameters).then(res => {
          this.people = res.data
        })
        return duty.postList(requestParameters).then(res => {
          res.data.forEach(item => {
            item.postName = item.employee && item.employee.postName
            item.employeeName = item.employee && item.employee.employeeName
          })
          // 更新汇总总数
          this.$nextTick(() => {
            this.$refs.auditSummary && this.$set(this.$refs.auditSummary.countInfo, 'total', res.totalSize)
          })
          return res
        })
      },
      editModel: 0,
      // rowSelection: {
      //   onChange: (e) => {
      //     this.countList[1].value = e.length
      //   },
      // },
      // countList: [
      //   {
      //     title: '',
      //     value: 'yq',
      //   },
      //   {
      //     key: 'sq',
      //     title: '实签人数',
      //     value: 0
      //   }
      // ], // 汇总列表
      // countList: [
      //   {
      //     title: '总数：',
      //     value: 'total',
      //     needUnit: true
      //   },
      //   {
      //     key: 'select',
      //     title: '已选择',
      //     value: 0
      //   }
      // ], // 汇总列表
      form: {},
      exportLoading: {
        0: false,
        1: false
      } // 导出loading
    }
  },
  methods: {
    /**
     * @description: 导出
     * @param {*} index：导出类型：0 选中，1 全部
     * @param {*} datas：选中项
     */
    handleExport(index, datas) {
      this.rate[index] = '0%'
      let args = {}
      if (datas?.length) {
        args.ids = datas
      } else {
        args = this.queryParam
      }
      this.exportLoading[index] = true
      duty
        .batchPrintPdf(args)
        .then(res => {
          if (res.code === 200 && res.data?.length) {
            // 格式化名称，防止重名被覆盖
            for (let idx in res.data) {
              let i = res.data[idx]
              i.name = Number(idx) + 1 + '.' + i.name
            }
            this.exportPdf(
              res.data,
              '质量责任制',
              list => {
                this.rate[index] = (((list.length * 100) / res.data.length).toFixed(2) || 0) + '%'
              },
              () => {
                this.exportLoading[index] = false
                this.rate[index] = ''
              }
            )
          } else {
            this.$message.warning('没有可导出的责任书！')
            this.exportLoading[index] = false
            this.rate[index] = ''
          }
        })
        .catch(() => {
          this.exportLoading[index] = false
          this.rate[index] = ''
        })
    },
    /**
     * 获取打印内容
     * id：业务id
     */
    getPritContent(id) {
      return duty
        .batchPrintPdf({
          ids: [id]
        })
        .then(res => {
          if (res.data[0]?.content) {
            return res.data[0].content
          }
        })
    },
    /**
     * 获取打印内容
     * value：搜索条件
     */
    search(value) {
      value && (this.queryParam = value)
      this.$refs.table.refresh(true)
    },
    /**
     * 操作栏
     */
    // 操作栏
    handleManage(type, record) {
      this.editModel = type
      let query = {
        editModel: type
      }
      if (record && record.projectId) {
        query.id = record.projectId
      }
      if (type == 2) {
        this.$router.push({
          name: 'dutySystemView',
          query:{
            editModel: type,
            projectId : record.projectId,
          }
        })
      } else {
        this.$router.push({
          name: 'dutySystemEdit',
          query
        })
      }
    }
  }
}
</script>
<style lang="less" scoped>
.people {
  padding: 0 10px;
}
</style>
